<template>
  <div class="index">
      <header>
          <van-icon name="scan" />
          <van-search
            shape="round"
            background="rgb(31, 143, 247)"
            placeholder="请输入搜索关键词"
            />
          <van-icon name="chat-o" badge="9" />
      </header>
      <main>
          <router-view/>
      </main>
      <footer>
        <router-link to="/index/home">首页</router-link>
        <router-link to="/index/about">问药</router-link>
        <router-link to="/index/kuaisu">快速问诊</router-link>
        <router-link to="/index/jilu">问诊记录</router-link>
        <router-link to="/index/my">我的</router-link>
      </footer>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
.index{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    header{
        width: 100%;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: space-around;
        background: rgb(31, 143, 247);
        color: #fff;
        font-size: 30px;
    }
    main{
        flex: 1;
        overflow-y: scroll;
        padding: 0 10px;
    }
    footer{
        width: 100%;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: space-around;
        a{
            color: rgb(79, 80, 80);
            padding-bottom: 5px;
            text-decoration: none;
        }
        .router-link-active{
            border-bottom: 2px solid rgb(32, 205, 248);
            color: rgb(32, 205, 248);
        }
    }
}
</style>